﻿@using TZL.Data;
@{
    Layout = null;
}
<link href="~/Content/themes/kindeditor.default.css" rel="stylesheet" />
<link href="~/Content/themes/uploadify.css" rel="stylesheet" />
<link href="~/Content/themes/ihover.css" rel="stylesheet" />
<script src="~/Content/jquery.uploadify.min.js"></script>
<script src="~/Content/kindeditor-all-min.js"></script>
<script src="~/Content/zh_CN.js"></script>
<style type="text/css">
    #coverUpload-button {
        margin-top: 20px;
        height: 22px;
        line-height: 22px;
        width: 68px;
    }
</style>

<table id="news" class="easyui-datagrid" style="width:100%;height:100%"
       url=""
       title="新闻信息" iconcls="icon-save" fitcolumns="true" sortname="CreateTime" sortorder="desc"
       pagination="true"
       idfield="NewId"
       fit="true"
       noheader="true"
       striped="true"
       singleselect="true"
       checkonselect="false"
       nowrap="true"
       loadmsg='正在加载……'
       rownumbers="true"
       frozencolumns="[[{ field:'ck'  checkbox:false }]]"
       toolbar="#tbNews">
    <thead>
        <tr>
            <th field="NewId" width="10" align="center" hidden="hidden">序号</th>
            <th field="ImgUrl" width="100" align="center" formatter="getImg">图片</th>
            <th field="Title" width="100" align="center">标题</th>
            <th field="Tag" width="100" align="center">标签</th>
            <th field="CategoryName" width="20" align="center">所属分类</th>
            <th field="PublishTime" width="100" align="center" formatter="formatTime">发布时间</th>
        </tr>
    </thead>
</table>
<div id="tbNews">
    <a href="#" class="easyui-linkbutton" iconcls="icon-add" plain="true" onclick="javascript:AddNews()">添加</a>
    <a href="#" class="easyui-linkbutton" iconcls="icon-cut" plain="true" onclick="javascript: UpdateNews()">修改</a>
    <a href="#" class="easyui-linkbutton" iconcls="icon-cancel" plain="true" onclick="javascript:DeleteNews()">删除</a>
    <select class="easyui-combobox" id="cateId" style="width:200px;" data-options="multiple:false" label="分类名称:">
        @foreach (var item in ViewBag.CategoryList)
        {
            <option value="@item.Key">@item.Value</option>
        }
    </select>
</div>

<div id="AddNews" class="easyui-dialog" title="添加类型" style="width:780px;height:650px;padding:20px" buttons="#news-dlg-buttons" data-options="iconCls:'icon-add',resizable:true,modal:true,closed:true">
    <div class="easyui-panel" data-options="fit:true,border:false">
        <form id="addNewsForm" method="post" action="/admin/AddNews">
            <input type="hidden" name="NewId" id="NewId" />
            <div style="margin-bottom:15px">
                <input class="easyui-textbox" name="Title" id="Title" label="标题:" labelPosition="top" style="width:50%;" required>
            </div>
            <div style="margin-bottom:15px">
                <input class="easyui-textbox" name="Brief" id="Brief" label="简介:" labelPosition="top" multiline="true" value="" style="width:50%; height:150px;">
            </div>
            <div style="margin-bottom:15px">
                <label>详情:</label><br />
                <textarea name="Content" id="Content" label="详情:" labelPosition="top" multiline="true" rows="15" value="" style="width:100%;" />
            </div>
            <div style="margin-bottom:15px">
                <select name="CategoryId" data-options="multiple:false" label="所属种类:" labelPosition="top" id="CategoryId" class="easyui-combobox" style="width:50%" required>
                    @foreach (var item in ViewBag.CategoryList)
                    {
                        <option value="@item.Key">@item.Value</option>
                    }
                </select>
            </div>

            <div style="margin-bottom:15px; display:block" id="d2">
                <input class="easyui-textbox" name="Tag" id="Tag" label="标记:" labelPosition="top" style="width:50%">
            </div>
            <div style="margin-bottom:15px;display:block" id="d1">
                <select name="Tag1" id="Tag1" data-options="multiple:false" label="标记" class="easyui-combobox" labelPosition="top" style="width:50%">
                    <option value="NSW">NSW</option>
                    <option value="VIC">VIC</option>
                    <option value="ACT">ACT</option>
                    <option value="QLD">QLD</option>
                </select>
            </div>
            <div style="margin-bottom:15px">
                <div>
                    <input class="easyui-textbox" name="ImgUrl" id="ImgUrl" label="图片:" labelPosition="top" style="width:50%;">
                    <input type="file" id="coverUpload" />
                </div>
                <div class="controls" name="coverImg" id="coverImg">
                    <label>预览：</label>
                </div>
            </div>

            <div style="margin-bottom:15px">
                <input class="easyui-datebox" id="ptime" name="PublishTime" label="发布时间:" labelPosition="top" style="width:50%">
            </div>
        </form>
    </div>
</div>
<div id="news-dlg-buttons">
    <table cellpadding="0" cellspacing="0" style="width:100%">
        <tr>
            <td>
                @*<img src="email.gif" />*@
            </td>
            <td style="text-align:right">
                <a href="#" class="easyui-linkbutton" iconcls="icon-save" onclick="javascript:SaveAddNews()">保存</a>
                <a href="#" class="easyui-linkbutton" iconcls="icon-cancel" onclick="javascript: $('#AddNews').dialog('close'); news_clear();">取消</a>
            </td>
        </tr>
    </table>
</div>

<script type="text/javascript">

    var uploadifyStatus = null;
    var addTEDescription = null;

    $(function () {

        $("#cateId").combobox({
            editable: false,
            onChange: function (newValue, oldValue) {
                $('#news').datagrid('load', {
                    categoryId: newValue
                });
                $('#news').datagrid('clearSelections');
                $("#CategoryId").combobox('setValue', newValue);
            },
            onLoadSuccess: function () {
                var v = $("#cateId").combobox('getValue');
                $('#news').datagrid({
                    url: '/Admin/SelectNewsList?categoryId=' + v

                });
            }
        });
        $("#CategoryId").combobox({
            editable: false,
            onChange: function (newValue, oldValue) {
                if (newValue == 1) {
                    $("#d1").css("display", "block");
                    $("#d2").css("display", "none");
                } else {
                    $("#d1").css("display", "none");
                    $("#d2").css("display", "block");
                }
            }
        });
    })

    function getImg(value, row, index) {
        return ['<img src=' + value + ' style="height:100px" />'].join('');
    }
    function AddNews() {

        if ($("#CategoryId").combobox('getValue') == 1) {
            $("#d2").hide(); $("#d1").show();
        } else {
            $("#d2").show(); $("#d1").hide();
        }
        news_clear();
        $("#AddNews").dialog('open');
        if (addTEDescription == null) {
            renderKindediter();
        }
        //上传封面图片
        if (uploadifyStatus == null) {
            renderUploadify();
        }
    }
    function SaveAddNews() {
        $("#addNewsForm").form('submit', {
            success: function (data) {
                data = eval("(" + data + ")");
                if (data.result) {
                    $("#AddNews").dialog('close');
                    if ($("#NewId").val() > 0)//ID存在
                    {
                        topCenter("修改新闻", "修改成功!");
                    }
                    else {
                        topCenter("添加新闻", "添加成功!");
                    }
                    $("#news").datagrid('reload');
                }
                else {
                    if ($("#NewId").val() > 0)//ID存在
                    {
                        topCenter("修改新闻", "修改失败!");
                    }
                    else {
                        topCenter("添加新闻", "添加失败!");
                    }
                }
                //$('#addNewsForm').form('clear');
            }
        })
    }
    function UpdateNews() {
        news_clear();
        var row = $("#news").datagrid("getSelected");
        if (row == null) {
            topCenter("提示", "请选择要修改的数据!");
            return;
        }
        if (addTEDescription == null) {
            renderKindediter();
        }

        //上传封面图片
        if (uploadifyStatus == null) {
            renderUploadify();
        }

        $("#NewId").val(row.NewId);
        $("#Title").textbox('setValue', row.Title);
        $("#Brief").textbox('setValue', row.Brief);
        addTEDescription.html(row.Content);
        $("#CategoryId").val(row.CategoryId);
        if (row.CategoryId == 1) {
            $("#d2").hide(); $("#d1").show();
            $("#Tag1").combobox('setValue', row.Tag)
        } else {
            $("#d2").show(); $("#d1").hide();
            $("#Tag").textbox('setValue', row.Tag);
        }
        $("#ImgUrl").textbox('setValue', row.ImgUrl);
        $("#coverImg").html("");
        $("#coverImg").append('<img src=' + row.ImgUrl + ' alt="" style="margin-bottom:20px"  height="150">');
        $("#ptime").datebox('setValue', setDateBoxFormat(row.PublishTime));
        $("#AddNews").dialog({ title: "修改新闻" });

        $("#AddNews").dialog('open');

    }
    function DeleteNews() {
        var row = $("#news").datagrid("getSelected");
        if (row == null) {
            topCenter("提示", "请选择要删除的数据!");
            return;
        }
        $.post('/Admin/DeleteNews', { newsId: row.NewId }, function (data) {
            if (data.result) {
                topCenter("提示", "删除成功!");
                $("#news").datagrid('reload');
            } else {
                topCenter("提示", "删除失败!");
            }
        });
    }
    function news_clear() {
        $("#NewId").val("");
        $("#Title").textbox("setValue", "");
        $("#Brief").textbox("setValue", "");
        KindEditor.html("#Content", "");
        $("#coverImg").html("");
        $("#ImgUrl").textbox("setValue", "");
        $("#Tag").textbox("setValue", "");
        $("#ptime").textbox("setValue", "");
    }
    function renderUploadify() {
        uploadifyStatus = $("#coverUpload").uploadify({
            'swf': '/Content/uploadify.swf',
            'buttonText': '上传',
            'uploader': '/Data/UploadImg',
            'multi': true,
            'fileTypeDesc': 'Image Files',
            'fileTypeExts': '*.gif; *.jpg; *.png',
            'onUploadSuccess': function (file, data, response) {
                var url = data.replace(/\"/g, "");
                $("#ImgUrl").textbox('setValue', url);
                $("#coverImg").html("");
                $("#coverImg").append('<img src=' + data + ' alt="" style="margin-bottom:20px"  height="150">');
            },
            'onUploadError': function (file, errorCode, errorMsg, errorString) {
                alert('图片 ' + file.name + ' 不能上传: ' + errorString);
            }
        });
        $("#fileUpload-button").removeClass("uploadify-button").addClass(".easyui-button").css("width", "45px").css("height", "20px").css("line-height", "20px");
    }
    function renderKindediter() {
        addTEDescription = KindEditor.create("#Content", {
            themeType: "simple",
            height: "300px",
            width: "500px",
            resizeType: 0,
            filterMode: false,
            langType: "zh_CN",
            uploadJson: '/data/Upload',
            afterCreate: function () { this.sync(); },
            afterBlur: function () { this.sync(); },
            items: [
                'source', '|', 'undo', 'redo', '|', 'cut', 'copy', 'paste', 'plainpaste', 'wordpaste', '|',
                'justifyleft', 'justifycenter', 'justifyright', 'justifyfull', 'insertorderedlist',
                'insertunorderedlist', 'indent', 'outdent', 'subscript',
                'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
                'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
                'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat',
                '|', 'table', 'hr', 'pagebreak', 'anchor', 'link', 'unlink', 'image'
            ]
        });
    }

    //value:时间戳, reutn :10/09/2016
    function setDateBoxFormat(value) {

        if (value == undefined) {
            return "";
        }
        if (value.length == 0) return "";

        var d = eval('new ' + value.substr(1, value.length - 2));
        var ar_date = [d.getMonth() + 1, d.getDate(), d.getFullYear()];
        for (var i = 0; i < ar_date.length; i++) ar_date[i] = dFormat(ar_date[i]);
        return ar_date.join("/");

        function dFormat(i) { return i < 10 ? "0" + i.toString() : i; }
    }
</script>
